import 'package:flutter/material.dart';

class GridViewCase extends StatelessWidget {
  const GridViewCase({Key? key}) : super(key: key);

  List<Widget> getChildren() {
    return [1, 2, 3, 4, 5, 6, 7, 8, 9, 10].map((int value) {
      return Container(
        alignment: Alignment.center,
        color: Colors.teal,
        child: Text(
          '第$value个',
          style: TextStyle(color: Colors.white, fontSize: 30),
        ),
      );
    }).toList();
  }

  @override
  Widget build(BuildContext context) {
    // return Padding(
    //     padding: const EdgeInsets.all(10),
    //     child: GridView(
    //       gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
    //         crossAxisCount: 5,
    //         childAspectRatio: 0.5,
    //         mainAxisSpacing: 10,
    //         crossAxisSpacing: 10,
    //       ),
    //       children: getChildren(),
    //     ));

    return Padding(
        padding: const EdgeInsets.all(10),
        child: GridView.builder(
          gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
            crossAxisCount: 4,
            childAspectRatio: 0.5,
            mainAxisSpacing: 10,
            crossAxisSpacing: 10,
          ),
          itemBuilder: (BuildContext context, int index) {
            return Container(
              alignment: Alignment.center,
              color: Colors.teal,
              child: Text(
                '第${index + 1}个',
                style: const TextStyle(color: Colors.white, fontSize: 30),
              ),
            );
          },
          itemCount: 30,
        ));
  }
}
